<!-- 考勤统计 -->
<template>
  <a-card :bordered="false">
    <a-form layout="inline" @keyup.enter.native="searchQuery">
      <a-form-item label="姓名">
        <j-select-user-by-dep v-model="queryParam.acctid"></j-select-user-by-dep>
      </a-form-item>
      <a-form-item label="工号">
        <a-input v-model="queryParam.acctid" />
      </a-form-item>
      <a-form-item>
        <a-button type="primary" icon="search" @click="searchQuery">查询</a-button>
      </a-form-item>
    </a-form>
    <vxe-grid
      ref="vxeTable1"
      border
      resizable
      height="530"
      :loading="loading"
      :toolbar-config="tableToolbar"
      :export-config="{}"
      :seq-config="{startIndex: (tablePage.currentPage - 1) * tablePage.pageSize}"
      :columns="tableColumn"
      @toolbar-button-click="toolbarButtonClickEvent"
      :data="tableData">
      <template v-slot:toolbar_buttons>
        <a-button type="primary" icon="plus" @click="handleAdd">新增</a-button>
        <a-dropdown v-if="selectedRowKeys.length > 0">
          <a-menu slot="overlay">
            <a-menu-item key="1" @click="batchDel"><a-icon type="delete" />删除</a-menu-item>
          </a-menu>
          <a-button>批量操作<a-icon type="down" /></a-button>
        </a-dropdown>
      </template>
      <template #operate="{ row }">
        <template>
          <a @click="handleEdit(row)">编辑</a>
          <a-divider type="vertical" />
          <a @click="handleDelete(row)">删除</a>
        </template>
      </template>
      <template v-slot:pager>
        <vxe-pager
          :layouts="['Sizes', 'PrevJump', 'PrevPage', 'Number', 'NextPage', 'NextJump', 'FullJump', 'Total']"
          :current-page.sync="tablePage.currentPage"
          :page-size.sync="tablePage.pageSize"
          :total="tablePage.total"
          @page-change="handlePageChange"
        >
        </vxe-pager>
      </template>
    </vxe-grid>
    <salary-user-modal ref="salaryUserModal" />
  </a-card>
</template>
<script >
import moment from 'moment'
import { postActionQs } from '@/api/manage'
import SalaryUserModal from './modal/SalaryUserModal'
import JSelectUserByDep from '@/components/jeecgbiz/JSelectUserByDep'
export default {
  name:'SalaryUser',
  components: {
    JSelectUserByDep,
    SalaryUserModal
  },
  data() {
    return {
      loading: false,
      queryParam: {
        month: ''
      },
      tableToolbar: {
        refresh: {
          query: () => {
            this.loadData(1)
          }
        },
        export: true,
        print: true,
        zoom: true,
        slots: {
          buttons: 'toolbar_buttons'
        }
      },
      tablePage: {
        total: 0,
        currentPage: 1,
        pageSize: 10
      },
      tableColumn: [
        { type: 'checkbox', width: 50 },
        { type: 'seq', width: 60 },
        { field: '8', title: '姓名' },
        { field: '1', title: '部门'},
        { field: '2', title: '薪资档次'},
        { field: '7', title: '基本工资' },
        { field: '9', title: '计算方式'},
        { field: '6', title: '入职日期' },
        { field: '10', title: '转正日期' },
        { field: '3', title: '停薪日期' },
        { title: '操作', width: 120, slots: { default: 'operate' } }
      ],
      tableData: [],
      selectedRowKeys:[],
      url: {
        list: '/wx/cp/oa/getCheckinMonthData',
        list2: '/wx/cp/oa/getCheckinDayData'
      }
    }
  },
  created() {
    this.loadData(1)
  },
  methods: {
    handlePageChange({ currentPage, pageSize }) {
      this.tablePage.currentPage = currentPage
      this.tablePage.pageSize = pageSize
      this.loadData()
    },
    loadData(arg) {
      // 加载数据 若传入参数1则加载第一页的内容
      if (arg === 1) {
        this.tablePage.currentPage = 1
      }
      this.loading = true
      var param = this.getQueryParams()
      setTimeout(() => {
        this.loading = false
        this.tableData = [{},{},{},{},{},{},{},{},{},{},{},{},{},{},{},{}]
        this.tablePage.total = 12
      },1000)
      return false
      postActionQs(this.url.list2, param).then(res => {
        console.log(JSON.stringify(res.result.datas))
        this.loading = false
        this.tablePage.total = 10
        this.tableData = res.result.datas
      })
    },
    toolbarButtonClickEvent({ code }) {
      switch (code) {
        case 'myExport':
          this.$refs.xGrid.exportData({
            type: 'csv'
          })
          break
        case 'refresh':
          this.loadData(1)
          break
      }
    },
    searchQuery() {
      this.loadData(1)
    },
    getQueryParams() {
      // 获取查询条件
      var param = {

      }
      return param
    },
    handleEdit(data){
      this.$refs.salaryUserModal.edit({})
    },
    handleAdd(data){
      this.$refs.salaryUserModal.add()
    },
    handleDelete(data){
      console.log(data)
    },
    batchDel(){

    }
  }
}
</script>
